<template>
  <div>
    <!-- 订单列表 2018/3/7 11:44 zuoW -->
    <Row>
      <i-col span="24">
        <Tabs v-model="tabParam.status">
          <template v-for="item in orderStatues">
            <TabPane :label="item.label" :name="item.val"></TabPane>
          </template>
        </Tabs>
        <!--未完成-->
        <tablePage ref="inspectionTab" :api="getMainOrderByPage" :param="tabParam" sort-name="endStationTime" sort-type="desc" :isStartLoad="true" v-if="tabParam.status==orderStatues[0].val">
          <template slot-scope="props">
            <Table :columns="inspectionColumnUnfinsih" :data="props.data" @on-sort-change="props.sortChange" border></Table>
          </template>
        </tablePage>

        <!--已完成-->
        <tablePage ref="inspectionTab" :api="getMainOrderByPage" :param="tabParam" sort-name="endStationTime" sort-type="desc" :isStartLoad="true" v-if="tabParam.status==orderStatues[1].val">
          <template slot-scope="props">
            <Table :columns="inspectionColumnfinsih" :data="props.data" @on-sort-change="props.sortChange" border></Table>
          </template>
        </tablePage>
        <!--<baseInspection :orderStatues="orderStatues" :inspectionColumn="inspectionColumn" :tabParam="tabParam"></baseInspection>-->
      </i-col>
    </Row>

    <xlinkModal v-model="operatModal.viewDetailShow" title="查看详情" width="1200">
      <viewDetailMainOrderList v-if="operatModal.viewDetailShow" :currentMainOrder="mainOrderCurrentRow"></viewDetailMainOrderList>
    </xlinkModal>
    <xlinkModal v-model="operatModal.finishViewDetailShow" title="查看详情" width="1200">
      <viewDetailMainOrderListFinish v-if="operatModal.finishViewDetailShow" :currentMainOrder="mainOrderCurrentRow"></viewDetailMainOrderListFinish>
    </xlinkModal>
    <xlinkModal v-model="operatModal.fleetDispatchShow" title="派单" width="1100">
      <fleetDispatch v-if="operatModal.fleetDispatchShow" :currentMainOrder="mainOrderCurrentRow"></fleetDispatch>
    </xlinkModal>
  </div>
</template>

<script>
  import tablePage from '@components/table/tablePage.vue'
  import { getMainOrderByPage } from '@api/backEnd/mainOrder'
  import { getTrackCodeByMainOrderNo } from '@api/backEnd/station'
  import baseInspection from './components/baseInspection'
  import xlinkModal from '@components/modal/xlinkModal'
  import viewDetailMainOrderList from './components/viewDetailMainOrderList'
  import viewDetailMainOrderListFinish from './components/viewDetailMainOrderListFinish'
  import fleetDispatch from './components/fleetDispatch'
  import moment from 'moment'

  export default {
    name: 'coming--tation-inspection',
    data () {
      let operatModal = {
        viewDetailShow: false,
        fleetDispatchShow: false,
        sendNoticeShow: false,
        assignmentOrderShow: false,
        dispatchDriverShow: false,
        viewDetailForFleetShow: false,
        finishViewDetailShow: false
      }
      let mainOrderCurrentRow = {}
      let orderStatues = [
        { label: '未完成', val: '5' },
        { label: '已完成', val: '6' }
      ]
      let inspectionColumnUnfinsih = [
        {
          title: '联运单号',
          key: 'orderNo',
          width: 200,
          fixed: 'left'
        },
        {
          title: '所在股道',
          width: 100,
          render: (h, params) => {
            let orderNo = params.row.orderNo
            getTrackCodeByMainOrderNo({ mainOrderNo: orderNo }).then((res) => {
              if (+res.data.isSuccess === 1) {
                params.row.paraPositionTrack = res.data.data.trackcode
                params.row.estimateArriveTime = res.data.data.get_time
              }
            })
            return (<span>{params.row.paraPositionTrack}</span>)
          }
        },
        {
          title: '派单时间',
          width: 200,
          render: (h, params) => {
            let thisdata = params.row.assignmentTime
            thisdata = thisdata ? moment(thisdata).format('YYYY-MM-DD HH:mm') : ''
            return (<span>{thisdata}</span>)
          }
        },
        {
          title: '剩余重箱',
          width: 150,
          key: 'allContaninersCount',
          sortable: true,
          render: (h, params) => {
            // let allContaninersCount = params.row.allContaninersCount
            // allContaninersCount = allContaninersCount ? +allContaninersCount : 0
            let bindContaninersCount = params.row.bindContaninersCount
            // bindContaninersCount = bindContaninersCount ? +bindContaninersCount : 0
            // let thisdata = allContaninersCount - bindContaninersCount
            return (<span>{bindContaninersCount}</span>)
          }
        },
        {
          title: '收发货人',
          ellipsis: 'false',
          key: 'shipper',
          render: (h, params) => {
            let shipper = params.row.shipper
            shipper = shipper ? shipper + '' : ''
            let receiver = params.row.receiver
            receiver = receiver ? receiver + '' : ''
            let thisdata = shipper + '-' + receiver
            return (<span>{thisdata}</span>)
          }
        },
        {
          title: '操作',
          key: 'action',
          align: 'center',
          width: 250,
          render: (h, params) => {
            let viewDetailBtn = (<i-button type="primary" size="small" style="margin-right: 5px;" onClick={() => this.viewDetailAction(params.row)}>查看详情</i-button>)
            let fleetSendSingleBtn = (<i-button type="primary" size="small" style="margin-right: 5px;" onClick={() => this.fleetDispatchAction(params.row)}>派单</i-button>)
            let btnArray = []
            powerUtil.contains('viewDetail') && btnArray.push(viewDetailBtn)
            powerUtil.contains('orderListUnfinishedFleet') && btnArray.push(fleetSendSingleBtn)
            return (btnArray)
          }
        }
      ]
      let inspectionColumnfinsih = [
        {
          title: '联运单号',
          key: 'orderNo',
          width: 185,
          fixed: 'left'
        },
        {
          title: '所在股道',
          width: 100,
          render: (h, params) => {
            let orderNo = params.row.orderNo
            getTrackCodeByMainOrderNo({ mainOrderNo: orderNo }).then((res) => {
              if (+res.data.isSuccess === 1) {
                params.row.paraPositionTrack = res.data.data.trackcode
                params.row.estimateArriveTime = res.data.data.get_time
              }
            })
            return (<span>{params.row.paraPositionTrack}</span>)
          }
        },
        {
          title: '派单时间',
          width: 200,
          render: (h, params) => {
            let thisdata = params.row.assignmentTime
            thisdata = thisdata ? moment(thisdata).format('YYYY-MM-DD HH:mm') : ''
            return (<span>{thisdata}</span>)
          }
        },
        {
          title: '剩余重箱',
          width: 150,
          key: 'allContaninersCount',
          sortable: true,
          render: (h, params) => {
            let thisdata = params.row.allContaninersCount - params.row.bindContaninersCount
            return thisdata ? moment(thisdata).format('YYYY-MM-DD HH:mm') : ''
          }
        },
        {
          title: '收发货人',
          ellipsis: 'false',
          key: 'shipper',
          render: (h, params) => {
            let shipper = params.row.shipper
            shipper = shipper ? shipper + '' : ''
            let receiver = params.row.receiver
            receiver = receiver ? receiver + '' : ''
            let thisdata = shipper + '-' + receiver
            return (<span>{thisdata}</span>)
          }
        },
        {
          title: '操作',
          key: 'action',
          align: 'center',
          width: 250,
          render: (h, params) => {
            let viewDetailBtnFinish = (<i-button type="primary" size="small" style="margin-right: 5px;" onClick={() => this.viewDetailFinishAction(params.row)}>查看详情</i-button>)
            let btnArray = []
            powerUtil.contains('viewDetail') && btnArray.push(viewDetailBtnFinish)
            powerUtil.contains('orderListUnfinishedFleet') && btnArray.push(viewDetailBtnFinish)
            return (btnArray)
          }
        }
      ]
      let tabParam = { startStationCode: '', endStationCode: '', status: orderStatues[0].val }
      let datas = { orderStatues, inspectionColumnUnfinsih, inspectionColumnfinsih, tabParam, operatModal, mainOrderCurrentRow, getMainOrderByPage }
      return datas
    },
    computed: {},
    methods: {
      viewDetailAction (row) {
        this.mainOrderCurrentRow = row
        this.operatModal.viewDetailShow = true
      },
      viewDetailFinishAction (row) {
        this.mainOrderCurrentRow = row
        this.operatModal.finishViewDetailShow = true
      },
      fleetDispatchAction (row) {
        this.mainOrderCurrentRow = row
        this.operatModal.fleetDispatchShow = true
      }
    },
    created () {
    },
    watch: {
      tabParam: {
        handler: function (val, oldVal) {
          this.$refs['inspectionTab'].dataRefresh()
        },
        deep: true
      }
    },
    mounted () {
    },
    components: { tablePage, baseInspection, xlinkModal, viewDetailMainOrderList, fleetDispatch, viewDetailMainOrderListFinish }
  }
</script>

<style scoped>

</style>
